<template>
  <div id="resource_syllabus" class="container">
    <div class="content">
      <div class="title">
        <!-- <el-breadcrumb separator-class="el-icon-arrow-right">
        <el-breadcrumb-item class="title" :to="{ path: '/internal_manage/resource_manage' }">资源管理</el-breadcrumb-item>
        <el-breadcrumb-item class="title"></el-breadcrumb-item>
      </el-breadcrumb> -->
        <!-- {{title}} -->
      </div>
      <div class="panel">
        <div class="back_Btn" @click="goBack">返回</div>
        <div>
          <table class="table" cellspacing="0">
            <thead class="thead">
              <tr>
                <td style="width: 10rem;">名称</td>
                <td style="width: 2rem;">种类</td>
                <td style="width: 2rem;">添加时间</td>
                <td style="width: 2rem;">课节文件</td>
                <td style="width: 2rem;">教参文件</td>
              </tr>
            </thead>
            <tbody class="tbody">
              <tr v-for="item,index in resourceList">
                <td>{{item.resourceName}}</td>
                <td>{{item.resourceType == 1 ?'文件夹':"文件"}}</td>
                <td>{{item.createTime}}</td>
                <td @click="gotoSyllabus(item)">
                  <div class="syllabusRes" v-if="hasPage('42')">详情</div>
                </td>
                <td @click="gotoReference(item)">
                  <div class="syllabusRes" v-if="hasPage('43')">详情</div>
                </td>
              </tr>
            </tbody>
          </table>
        </div>
        <el-pagination class="page" layout="total, sizes, prev, pager, next, jumper" :current-page="tabledisplayObj.currPage"
          @size-change="pageSizeChange" @current-change="tabledisplayChangePage" :total="tabledisplayObj.total"></el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
  let vm;
  let user;
  let menu;
  export default {
    data() {
      return {
        resourceList: [],
        title: "",
        tabledisplayObj: {
          currPage: 1,
          pageSize: 10,
          total: 0,
          resourceParentId: 0,
          startOrderBy:"",
          endOrderBy:""
        },
      };
    },
    components: {},
    methods: {
      pageSizeChange: function(val) {
        //页条数发生改变
        vm.tabledisplayObj.pageSize = val;
        this.initData();
      },
      /**表格显示形式翻页 */
      tabledisplayChangePage(val) {
        console.log(val);
        vm.tabledisplayObj.currPage = val;
        this.initData();
      },
      goBack() {
        this.$router.go(-1); //返回上一层
      },
      /**进入课节资源
       * @param {Object} item 课程
       */
      gotoSyllabus(item) {
        let paras = {
          resourceParentId: item.resourceId,
          resourceName: "课节文件"
        }
        api.resourceOne(paras).then(function(data) {
          if (data.resultCode == 2000) {
            if (data.info == "{}") return;
            let isNotUpdate = "1";
            if(user.roleMode <= 1 && item.resourceAttributionType == 2){
              isNotUpdate = "2";
            }
            var path = vm.$store.state.permit["42"].path;
            //传递参数
            vm.$router.push({
              path: path,
              query: {
                resourceParentId: tool.encode(data.info.resourceId),
                title: item.resourceName,
                bosBaseUrl: data.info.bosResourceUrl,
                isNotUpdate:isNotUpdate
              }
            });
          } else {
            vm.$message.error(data.message);
          }
        });



      },
      /**进入教参资源
       * @param {Object} item 课程
       */
      gotoReference(item) {
        let paras = {
          resourceParentId: item.resourceId,
          resourceName: "教参文件"
        }
        api.resourceOne(paras).then(function(data) {
          if (data.resultCode == 2000) {
            if (data.info == "{}") return;
             let isNotUpdate = "1";
            if(user.roleMode <=1 && item.resourceAttributionType == 2){
              isNotUpdate = "2";
            }
            var path = vm.$store.state.permit["43"].path;
            //传递参数
            vm.$router.push({
              path: path,
              query: {
                resourceParentId: tool.encode(data.info.resourceId),
                title: item.resourceName,
                bosBaseUrl: data.info.bosResourceUrl,
                isNotUpdate:isNotUpdate
              }
            });
          } else {
            vm.$message.error(data.message);
          }
        });
      },
      /**
       * 初始化数据
       */
      initData() {
        api.resourceList(vm.tabledisplayObj).then(function(data) {
          if (data.resultCode == 2000) {
             data.list.forEach(item => {
            item.createTime = item.createTime.split(" ")[0];
          });
            vm.tabledisplayObj.total = data.totalCount;
            vm.resourceList = data.list;
          } else {
            vm.$message.error(data.message);
          }
        });
      },
    },
    mounted() {
      vm = this;
      user = tool.getItem(lsKey.user, true); //得到当前用户信息
      let resourceId = tool.decode(this.$route.query.resourceId);
      let title = tool.decode(this.$route.query.title);
      vm.tabledisplayObj.startOrderBy = this.$route.query.startOrderBy == undefined ?"":this.$route.query.startOrderBy;
      vm.tabledisplayObj.endOrderBy = this.$route.query.endOrderBy == undefined ?"":this.$route.query.endOrderBy;
      // menu = tool.decode(this.$route.query.menu);
      vm.tabledisplayObj.resourceParentId = resourceId;
      vm.title = title;
      vm.initData();
    },
    computed: {}
  };
</script>

<style lang="scss">
  #resource_syllabus {
    .el-input__inner {
      border-radius: 0.08rem;
      font-size: 0.16rem;
      color: #666666;
      height: 0.36rem;
      line-height: 0.36rem;
    }

    .el-input__icon {
      line-height: 0.36rem;
    }

    .input_search {
      .el-input__inner {
        background-color: rgb(247, 248, 250);
      }
    }

    .syllabusRes {
      text-decoration: underline;
      color: #3885f8;
      font-size: 0.16rem;
      cursor: pointer;
    }

    .el-breadcrumb__separator {
      color: #999999;
    }

    .el-breadcrumb__inner.is-link {
      font-weight: 400;
      color: #141414;
    }

    .el-breadcrumb__inner.is-link:hover {
      color: #3885f8;
    }

    .el-breadcrumb__item:last-child .el-breadcrumb__inner {
      color: #999999;
    }

    .back_Btn {
      color: #3885F8;
      line-height: 0.68rem;
      padding-left: 0.34rem;
      background-image: url('../../assets/img/education_manage/orderForeignTeacher/back.png');
      background-repeat: no-repeat;
      font-size: 0.18rem;
      background-size: 0.2rem;
      background-position: 0.1rem center;
      cursor: pointer;
    }
  }
</style>
<style scoped src="@/style/module/table.css"></style>
<style scoped src="@/style/clue_manage/clue_manage.css"></style>
<style scoped>
  .right_btn {
    background-image: url(../../assets/img/clue_manage/add_white.png);
    width: 1.54rem;
  }
</style>
